<template>
  <div>
    <MyHeader
      :title="'购物车案例'"
      :bgc="'skyblue'"
      :color="'#030303'"
    ></MyHeader>
    <div class="main">
      <MyGoods
        v-for="(item, index) in list"
        :key="index"
        :item="item"
      ></MyGoods>
    </div>
    <MyFooter :list="list"></MyFooter>
  </div>
</template>

<script>
// 引入
import MyHeader from '@/components/MyHeader'
import MyGoods from '@/components/MyGoods'
import MyFooter from '@/components/MyFooter'
export default {
  data() {
    return {
      list: [],
    }
  },
  //注册
  components: {
    MyHeader,
    MyGoods,
    MyFooter,
  },
  created() {
    //axios请求
    this.$axios({
      url: 'api/cart',
    })
      .then((res) => (this.list = res.data.list))
      .catch((err) => console.log(err))
  },
}
</script>

<style>
.main {
  padding-top: 45px;
  padding-bottom: 50px;
}
</style>
